import React, {useState,useEffect} from 'react';
import {getShowData} from '../../api/pro'
import {Table, Image, Switch} from 'antd'


const Recommend = () => {

  const [proList,setProList] = useState()
  // 当前页
  const [current,setCurrent] = useState(1)

  useEffect(()=>{
    getShowData({
      type: 'isrecommend',
      flag: 1
    }).then(res => {
      console.log(res);
      setProList(res.data)
    })
  },[])

  const columns = [
    {
      title: '序号',
      width: 60,
      render(t,r,i){
        return (<span>{(current - 1) * 5 + i + 1}</span>)
      }
    }, {
      title: '商品名称',
      width: 300,
      align: 'center',
      dataIndex: 'proname'
    },{
      title: '商品图片',
      dataIndex: 'img1',
      render(t){
        return (<Image src={t} height={50} />)
      }
    },{
      title: '商品分类',
      dataIndex: 'category',
    },{
      title: '商品价格',
      dataIndex: 'originprice',
    },{
      title: '商品折扣',
      dataIndex: 'discount',
    },{
      title: '是否推荐',
      dataIndex: 'isrecommend',
      render(t){
        return (<Switch defaultChecked={t} />)
      }
    },{
      title: '是否售卖',
      dataIndex: 'issale',
      render(t){
        return (<Switch defaultChecked={t} />)
      }
    },{
      title: '是否秒杀',
      dataIndex: 'isseckill',
      render(t){
        return (<Switch defaultChecked={t} />)
      }
    }

  ]

  return (
    <div>
      推荐列表


      <Table
      dataSource={proList}
      rowKey='proid'
      columns={columns}
      pagination= {{
        defaultPageSize: 5,
        onChange(count){
          // console.log(count);
          setCurrent(count)
        }
      }}
      scroll={{
        y: 400,
        x: 1300
      }}
       />;
    </div>
  );
};

export default Recommend;
